<template>
  <div class="home" v-back="back">
    <button v-back="'green'" @click="color('green')">提交</button>
    <button v-back="'red'" @click="color('red')">危险</button>
  </div>
</template>

<script>
// @ is an alias to /src


export default {
  name: 'Home',
  components: {
  },
  data(){
    return{
      back: ''
    }
  },
  methods: {
    color(val){
      console.log(val);
      this.back = val;
    }
  },
  // directives:{ // 局部的自定义指令
  //   back:{
  //     update(el,binding,vnode){ 
  //       el.style.background = binding.value;
  //       // console.log(binding);
  //     }
  //   }
  // }
}
</script>
<style lang="scss">
  .home{
    height: 400px;
  }
</style>
